import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
//PostCss：引入自定义补全
import autoprefixer from 'autoprefixer'
//使用vite-plugin-mock插件
import { viteMockServe } from "vite-plugin-mock";
// vant按需加载
import Components from 'unplugin-vue-components/vite'
import AutoImport from 'unplugin-auto-import/vite'
import { VantResolver } from '@vant/auto-import-resolver';
//native ESM
import legacy from '@vitejs/plugin-legacy'
//路径别名
import path from "path";
//postcss,px转rem
import pxtorem from 'postcss-pxtorem'

// https://vitejs.dev/config/
export default defineConfig({
    //部署路径
    base: './',
    server: {
        proxy: {
          '/api': {
                target: '127.0.0.1:3000',
                changeOrigin: true
            }
        }
    },
    resolve:{
		alias: {
			"@": path.resolve(__dirname, "src")
		},
    },
    plugins: [
        vue(),
		AutoImport({
			resolvers: [VantResolver()],
		  }),
		  Components({
			resolvers: [VantResolver()],
		  }),
		legacy({
			targets: ['defaults', 'not IE 11']
		}),
		viteMockServe({
			// default
			mockPath: './mock',
			supportTs:false,
			localEnabled: true,
			prodEnabled:false
		})
    ],
	css: {
		preprocessorOptions: {
			less: {
				javascriptEnabled: true,
				additionalData:  `@import "${path.resolve(__dirname, 'src/style/common.less')}";`
			}
		},
		postcss:{
			plugins:[
				autoprefixer,
				pxtorem({
					rootValue: 37.5, // 设计稿宽度为375时，rootValue设为37.5
					propList: ['*'], // 需要转换的属性
					selectorBlackList: ['.not'], // 匹配不被转换为rem的选择器
				}),
			]
		}
	},
})
